<%--
  Created by IntelliJ IDEA.
  User: 42531
  Date: 2019/2/15
  Time: 14:23
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="cc" uri="http://java.sun.com/jsp/jstl/core" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>layout 后台大布局 - Layui</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
</head>
<body class="layui-layout-body" style="margin-left: 15px;margin-top: 10px">

<form class="layui-form layui-form-pane " action="/page/UserServlet">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">姓名</label>
            <div class="layui-input-block">
                <input type="text" name="name" value="${queryUser.name}" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">年龄</label>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="text" name="aegMin" value="${queryUser.age>0?queryUser.age:''}" placeholder="" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid">-</div>
            <div class="layui-input-inline" style="width: 100px;">
                <input type="text" name="ageMax"  value="${queryUser.maxAge>0?queryUser.maxAge:''}" placeholder="" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <button class="layui-btn" lay-submit="" lay-filter="demo2">查询</button>
        </div>
    </div>
</form>

<div class="layui-form">
    <table class="layui-table">
        <colgroup>
            <col width="150">
            <col width="150">
            <col width="200">
            <col>
        </colgroup>
        <thead>
        <tr>
            <th>编号</th>
            <th>姓名</th>
            <th>地址</th>
            <th>年龄</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <cc:forEach var="mybatis_test" items="${userList}">
            <tr>
                <td>${mybatis_test.id}</td>
                <td>${mybatis_test.name}</td>
                <td>${mybatis_test.address}</td>
                <td>${mybatis_test.age}</td>
                <td>
                    <div class="layui-btn-group">
                        <button class="layui-btn ">编辑</button>
                        <button class="layui-btn">删除</button>
                    </div>
                </td>
                </td>
            </tr>
        </cc:forEach>
        </tbody>
    </table>
</div>


<div id="page"></div>

<script src="/layui/layui.js"></script>
<script>
    //JavaScript代码区域
    layui.use(['element', 'laypage'], function () {
        var laypage = layui.laypage;
        var element = layui.element;

        //完整功能
        laypage.render({
            elem: 'page'
            , count: 100
            , layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
            , jump: function (obj) {
                console.log(obj)
            }
        });

    });
</script>
</body>
</html>